<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>QQ-TIM</title>
    <link rel="stylesheet" href="css/index.css" />
</head>
<body>
    <!--顶部导航-->
    <nav class="qq_nav">
        <div class="wrapper">
            <div class="left-logoimg">
                <a class="qq-logo" href="#"></a>
                <ul>
                    <li><a class="active" href="#">首页</a></li>
                    <li><a href="#">下载</a></li>
                    <li><a href="#">动态</a></li>
                </ul>
            </div>
            <div class="right-login">
                <ul>
                    <li><a href="#">登录</a></li>
                    <li><a href="#">QQ会员</a></li>
                    <li><a href="#">QQ安全</a></li>
                </ul>
                <a class="qq-login" href="#">注册</a>
                <span>当前在线人数：227,763,015</span>
            </div>
        </div>
    </nav>

    <!--展示-->
    <section class="qq_banner">
        <img src="img/banner-logo.png" alt="">
        <img src="img/banner-download.png" alt="">
        <img src="img/banner-list.png" alt="">
        <img src="img/banner-product.png" alt="">
    </section>

    <!--语音-->
    <section class="qq_sound">
        <h1>I'm QQ - 每一天，乐在沟通</h1>
        <div class="qq_sound_gire_bg" data-stellar-background-ratio="0.3"></div>
        <div class="sound_wrapper">
            <div class="iphone"></div>
            <h2>沟通，是跨越</br>千山万水的亲切声音</h2>
            <p>无论何时何地，你都能自由享受QQ在各类</br>终端上带来的高清通话，与好友一起想聊多久聊多久</p>
        </div>
    </section>

    <!--文件-->
    <section class="qq_file">
        <div class="qq_file_bg" data-stellar-background-ratio="0.3"></div>
        <div class="file_wrapper">
            <h2>沟通，是随时随地</br>爽快收发</h2>
            <p>通过QQ,电脑和手机上的文件都能收发自如,</br>更有手机在线查阅，轻松你的工作和生活。</p>
            <div class="conmentple"></div>
        </div>
    </section>

    <!--兴趣-->
    <section class="qq_interest">
        <div class="qq_interest_bg" data-stellar-background-ratio="0.3"></div>
        <div class="interest_wrapper">
            <h2>沟通，是志同道合<br>的他们放肆青春</h2>
            <p>即使世界很大，你也不会孤单，在兴趣部落<br>有和你一样的人，期待着和你一起发现精彩。</p>
            <div class="interest_iphone"></div>
        </div>
    </section>
    <script src="js/jquery.min.js"></script>
    <script src="js/jquery.stellar.js"></script>
    <script src="js/index.js"></script>
</body>
</html>